@extends('layouts.app')

@section('style')
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="stylesheet" href="/plugins/datatables/dataTables.bootstrap.css">

@endsection

@section('content')

    <div class="content-wrapper">
        <section class="content-header">
            <h1>
                游戏类型管理
                <small>游戏类型列表</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> 管理后台</a></li>
                <li><a href="#">游戏类型管理</a></li>
                <li class="active">游戏类型列表</li>
            </ol>
        </section>

        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                            <h3 class="box-title">游戏类型列表</h3>
                            <a href="{{ url('admin/gameType/create') }}" class="btn btn-info btn-xs" style="vertical-align:top;">
                                <i class="fa fa-edit"></i> 添加游戏类型
                            </a>
                        </div>
                        <div class="box-body">
                            <table id="album-type-list" class="table table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th width="5%">ID</th>
                                    <th>游戏类型名称</th>
                                    <th width="10%">创建时间</th>
                                    <th width="10%">操作</th>
                                </tr>
                                </thead>
                                <tbody></tbody>
                                <tfoot>
                                <tr>
                                    <th width="5%">ID</th>
                                    <th>游戏类型名称</th>
                                    <th width="10%">创建时间</th>
                                    <th width="10%">操作</th>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>

@endsection

@section('javascript')

    <script src="{{ asset('/plugins/jQuery/jquery-2.2.3.min.js') }}"></script>
    <script src="{{ asset('/bootstrap/js/bootstrap.min.js') }}"></script>
    <script src="{{ asset('/plugins/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('/plugins/datatables/dataTables.bootstrap.min.js') }}"></script>
    <script src="{{ asset('/plugins/slimScroll/jquery.slimscroll.min.js') }}"></script>
    <script src="{{ asset('/plugins/fastclick/fastclick.js') }}"></script>
    <script src="{{ asset('/js/app.min.js') }}"></script>
    
    <script>$(function () {
            var tableObj = $('#album-type-list').DataTable({
                language: {
                    'url': '/plugins/datatables/language/zh-CN.json'
                },
                "lengthChange": false,
                "searching": false,
                "ordering": false,
                "info": true,
                "autoWidth": false,
                "processing": true,
                "serverSide": true,
                "ajax": "/admin/gameType/list"
            });

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });


            // 模拟 DELETE 请求来删除分类，一定要在 draw 事件之后
            tableObj.on('draw', function (e){
                $('.btn-remove').on('click', function(){
                    if (confirm('确定删除吗？')) {
                    　  $.ajax({
                            url: '/admin/gameType/' + $(this).data('id'),
                            type: "DELETE",
                            success:function(data){
                                // console.log(data);
                                // 因为重定向之后，浏览器根据重定向 url 发送的请求，使用的请求方式不会改变，依然是 DELETE，导致出错。
                                // 所以，需要在这里进行处理。单单 php 的 response() 和 header() 无法实现删除后跳转。
                                if (data.code == 200) {
                                    window.location.href = "{{ url('admin/gameType') }}";
                                } else if (data.code == 4000) {
                                    alert('参数不合法，必须是大于 0 的正整数.');
                                } else if (data.code == 4001) {
                                    alert('要删除的分类不存在.');
                                } else if (data.code == 4002) {
                                    alert('分类删除失败.');
                                } else if (data.code == 5555) {
                                    alert('分类删除失败. 被 catch 了.');
                                }
                            }
                        });
                    }
                });
            });
        });
    </script>

@endsection